<div style="border: solid 1px red; padding: 20px">

<h3>Checkout date(s)</h3>

<hr>

<% if session[:cart] %>
<div id="dat">
    <table id="date-table" class="tablesorter" border="0" cellpadding="0" cellspacing="1">
      <thead>
        <tr>
          <th>
            Name
          </th>
          <th>
            Description
          </th>
          <th>
            Out Date
          </th>
          <th>
            Return Date
          </th>
          <th>
            Remove
          </th>
        </tr>
      </thead>
      <tbody>
      <% for equipment in session[:cart] %>
        <tr>
          <td>
	          <%= h(equipment.name) %>
	        </td><td>
	          <%= truncate(h(equipment.description),20) %>
	        </td><td>
	          <input class="dat-out" type="text" value="<%= Date.today %>"
            onfocus="this.select();calendar_open(this,{format:'%Y-%m-%d'})"
            onclick="event.cancelBubble=true;this.select();calendar_open(this,{format:'%Y-%m-%d'})" />
	        </td><td>
	          <input class="dat-in" type="text" value="<%= Date.today %>"
            onfocus="this.select();calendar_open(this,{format:'%Y-%m-%d'})"
            onclick="event.cancelBubble=true;this.select();calendar_open(this,{format:'%Y-%m-%d'})" />
	        </td><td>
	          <%= link_to "[X]", {:action => "remove_from_cart2", :id => equipment.id}, {:method => :post, :confirm => "Confirm removal of #{equipment.name}"} %>
          </td>
        </tr>
      <% end %>
      </tbody>
      <tfoot>
        <tr>
          <th></th>
          <th></th>
          <th>
          <input id="outdat" type="text" value="<%= Date.today %>"
            onfocus="this.select();calendar_open(this,{format:'%Y-%m-%d'})"
            onclick="event.cancelBubble=true;this.select();calendar_open(this,{format:'%Y-%m-%d'})" />
          </th>
          <th>
          <input id="indat" type="text" value="<%= Date.today %>"
            onfocus="this.select();calendar_open(this,{format:'%Y-%m-%d'})"
            onclick="event.cancelBubble=true;this.select();calendar_open(this,{format:'%Y-%m-%d'})" />
          </th>
          <th></th>
        </tr>
      </tfoot>
    </table>
</div>
<% else %>
<p>Cart is empty</p>
<% end %>

<hr>

<%= link_to 'Back', :action => 'equipment' %>
<span class="right"><%= link_to 'Contiunue', :action => 'create_rental' %></span>

<script type="text/javascript">

function outDates() {
  $("#date-table .dat-out").each(function() {
    $(this).val($("#outdat").val());
  });
}

function inDates() {
  $("#date-table .dat-in").each(function() {
    $(this).val($("#indat").val());
  });
}
</script>

</div>

